@charset "utf-8";
@import "common/reset";

@function n($px){
    @return $px/2;
}
$border-color:#ff9344;//边框颜色
.web{
    width: 100%;
    position: relative;
    overflow: hidden;
    header{
        overflow: hidden;
        height:n(62px);
        margin-top:n(45px);
        line-height: n(60px);
        .left{
            width: n(124px);
            height: n(60px);
            border: 1px solid $border-color;
            border-radius: 25px;
            text-align: center;
            font-size: n(20px);
            margin-left: n(24px);
            a{
                color: black;
                display: block;     
            }
        }
        .right{
            width: n(184px);
            select{
             -webkit-appearance:none;//清除原始样式
             width: n(159px);
             height: n(55px);
             border: n(2px) solid #ff9344;
             background: url(../img/下拉框_03.png) no-repeat
             right n(12px) top n(22px) #ffffff;
             background-size: n(30px) n(16px);
             border-radius: n(3px);
             text-indent: n(13px);
             margin-right: n(22px);
             font-size: n(26px);
            }
        }
        .middle{
            overflow: hidden;
            text-align: center;
            line-height: n(62px);
            vertical-align: middle;
            font-size: n(24px);
        }
        
    }
    nav{
        ul:nth-of-type(1){
            width: 100%;
            text-align: center;
            margin-top: n(20px);
            overflow: hidden;
            li{
                width: 25%;
                float: left;
                a{
                    color: black;
                    img{
                    width:n(150px);
                    height: n(150px);
                    border-radius: 50px;
                }
                span{
                    display: block;
                }
                }
            }
        }
        ul:nth-of-type(2){
            width: 100%;
           margin-top: n(17px);
            li{
                &:nth-of-type(1){
                    margin-left: 43.2%;
                    background: #FF9344;
                }
                width: n(18px);
                height: n(18px);
                background: #ffc9a1;
                border-radius: 50px;
                float: left;
               
                margin-right: 0.93%;
                
                
            }
        }
    }
    section{
         .zonghe{
            height: n(74px);
            margin-bottom: n(23px);
            &:nth-of-type(4){
                margin-bottom:n(46px);
            }
            .zonghe_left{
                height: n(74px);
                line-height: n(74px);
                margin-left: n(24px);
                img{
                    vertical-align: middle;
                    width: n(60px);
                    height: n(74px);
                }
                span{
                    vertical-align: middle;
                    font-size: n(30px);
                    margin-left: n(7px);
                }
            }
            .more_right{
                height: n(74px);
                line-height: n(74px);
                margin-right: n(24px);
                span{
                    vertical-align: middle;
                    font-size: n(26px);
                }
                i{
                    vertical-align: middle;
                    font-size: n(25px);
                    color: $border-color;
                }
            }
            &:nth-of-type(3){
                margin-top: n(50px);
            }
            &:nth-of-type(5){
                margin-top: n(50px);
            }
        }
        .zonghe_img{
            width: 100%;
            height:n(134px);
            line-height: n(134pxs);
            margin-top: n(15px);
            ul{
                width: 100%;
                padding-left: n(22px);
                li{
                    float: left;
                    width:17.86%;
                    height:n(134px);
                    overflow: hidden;
                    position: relative;
                    margin-right:7.6%;
                    &:nth-of-type(4){
                        margin-right: 0;
                    }
                    img{
                        position: absolute;
                        top: -999px;
                        left: -999px;
                        right: -999px;
                        bottom: -999px;
                        margin: auto;
                    }
                }
                
            }
        }
    }
    footer{
        position: fixed;
        bottom: 0;
        left: 0;
        width: 100%;
        background-color: white;
        ul{
            li{
                float: left;
                width: 25%;
                a{
                    display: block;
                    text-align: center;
                    color: black;
                    i{
                        font-size: n(68px);
                        color: $border-color;
                    }
                    h2{
                        font-size: n(26px);
                        margin-top: n(9px);
                        margin-bottom: n(14px);
                        
                    }
                }
            }
        }
    }
}
